@if (item(); as item) {
  <nz-form-item class="ui-form__item">
    @switch (item.type) {
      @case ('number') {
        <nz-form-label>{{ item.description }}</nz-form-label>
        <nz-form-control>
          <nz-input-number
            [ngModel]="data()"
            [name]="item.key"
            (ngModelChange)="dataChange.emit($event)"
          />
        </nz-form-control>
      }
      @case ('boolean') {
        <nz-form-label>{{ item.description }}</nz-form-label>
        <nz-form-control>
          <nz-switch
            [ngModel]="data()"
            [name]="item.key"
            (ngModelChange)="dataChange.emit($event)"
          />
        </nz-form-control>
      }
      @case ('string') {
        @if (isStringOrUndefined(data())) {
          <app-schema-form-item-input
            [item]="item"
            [data]="asStringOrUndefined(data())"
            (dataChange)="dataChange.emit($event)"
          />
        }
      }
      @case ('array') {
        @if (isArrayOrUndefined(data())) {
          <app-schema-form-item-list
            [item]="item"
            [data]="asArrayOrUndefined(data())"
            (dataChange)="dataChange.emit($event)"
          />
        }
      }
      @default {
        @if (item.ref) {
          @switch (item.refType) {
            @case ('enum.string') {
              <nz-form-label>{{ item.description }}</nz-form-label>
              <nz-form-control>
                <nz-select
                  [ngModel]="data()"
                  (ngModelChange)="dataChange.emit($event)"
                  name="item.key"
                  nzPlaceHolder="Choose"
                >
                  @for (option of getSelectOptions(item); track option) {
                    <nz-option [nzValue]="option.value" [nzLabel]="option.label" />
                  }
                </nz-select>
              </nz-form-control>
            }
          }
        }
      }
    }
  </nz-form-item>
}
